<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>openlayers_API</title>
  </head>
  <script src="/static/common.js"></script>
  <script src="https://unpkg.com/gifler@0.1.0/gifler.min.js"></script>
  <!--<script src="https://unpkg.com/elm-pep"></script>-->
  <script src="https://cdn.polyfill.io/v3/polyfill.min.js?features=fetch,requestAnimationFrame,Element.prototype.classList,URL,TextDecoder,Number.isInteger"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.min.js"></script>
  <script src="https://api.mapbox.com/mapbox.js/plugins/arc.js/v0.1.0/arc.js"></script>
  <script src="https://mapbox.github.io/geojson-vt/geojson-vt-dev.js"></script>
  <!--<script src="https://openlayers.org/en/v6.5.1-dev/examples/resources/mapbox-streets-v6-style.js"></script>-->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/mapbox-gl/1.13.0/mapbox-gl.js"></script>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/mapbox-gl/1.13.0/mapbox-gl.css">
  <script src="https://api.tiles.mapbox.com/mapbox.js/plugins/turf/v2.0.0/turf.min.js"></script>
  <body style="margin: 0; padding: 0">
    <div id="app"></div>
    <!-- built files will be auto injected -->
    <script>
      // 设置初始化的，字体大小，之后的css里面用font-size单位用rem，字体就会随着屏幕大小改变了
      function placeholderPic(){
        document.documentElement.style.fontSize=document.documentElement.offsetWidth/60+"px" //同上
      }
      placeholderPic()
      window.onresize=function(){  //窗口改变时再次执行一次函数即可
        placeholderPic()
      }
    </script>

  </body>
</html>
